<template>
  <div id="feedback-list">
    <ul>
      <li v-for="(item, index) of feedbackInfo" :class="{current: isCurrent === index}">
        <div class="feedback-item-head" @click="toggleCurrent(index)">
          <time>{{item.commitTime}}</time>
          <span>{{item.state == '01'?'已回复':'未回复'}}</span>
        </div>
        <div class="feedback-item-content">
          <h3>Q: {{item.content}}</h3>
          <div class="feedback-img-box">
            <img v-for="imgItem of item.imgList" :src="imgItem.attachmentUrl" alt="问题图片">
          </div>
          <div class="feedback-txt" v-if="item.state == '01'">
            {{item.feedback}}
          </div>
        </div>
      </li>
    </ul>
    <router-link :to="{path: 'feedbackform', query:{empNo: personalId}}" class="btn-addOpinion"><span>+</span>添加意见反馈
    </router-link>
    <!--正在加载提示框-->
    <loading v-if="loadShow"></loading>
    <!--加载失败弹框-->
    <dialog-box :message="dialogMessage" v-if="dialogShow" @close-dialog="closeDialog" @cancle-dialog="closeDialog"></dialog-box>
    <div class="no_data" v-if="!feedbackInfo.length">
      <i class="ion ion-ios-paper-outline"></i>
      <p>暂无数据</p>
    </div>
  </div>
</template>
<script type="text/javascript">
  import '../../assets/css/feedbackList.scss';
  import interfaceAPI from '../../assets/js/insterface.js';
  import http from '../../assets/js/http_mixin'
  import getQuery from '../../assets/js/get_querys'
  var feedbackListUrl = interfaceAPI.feedbackListUrl;
  export default{
    data(){
      return {
        personalId: '',            // 储存empNo
        pageTotle: '',             // 页面总数
        count: 0,                  // 计数，记录当前页面的值
        busy: false,
        feedbackInfo: [],
        isCurrent: 0          // 当前选项
      }
    },
    mixins: [http, getQuery],
    methods: {
      toggleCurrent: function (index) {
        this.isCurrent = index;
      }
    },
    mounted(){
      document.title = '反馈意见列表';
      var query = this.getQuerys();
      this.personalId = query.empNo;
      // 请求页面信息
      this.getInfo({
        url: feedbackListUrl,
        param: {
          'empNo': this.$route.query.empNo,
          'currentPage': this.count,
          'pageSize': '10'
        },
        success: function (response) {
          var _this = this;
          var responseData = response.body.data;
          this.pageTotle = response.body.pages;
          if (this.pageTotle > this.count) {
            if (responseData.length > 0) {
              for (var i = 0; i < responseData.length; i++) {
                this.feedbackInfo.push(responseData[i]);
              }
            }
            this.count++;
          }
          this.busy = false;
          return false;
        },
        fail: function (response) {
          this.dialogMessage = '请求失败，请稍后再试';
          this.dialogShow = true;
        }
      });
    }
  }
</script>
